import styled from 'styled-components'


export const HomeWrapper = styled.div`
    width:960px;
    margin:0 auto;
    overflow:hidden;
`

export const HomeLeft = styled.div`
    width:625px;
    margin-left:15px;
    padding-top:30px;
    float:left;
    .banner-img{
        width:625px;
        height:270px;
        vertical-align: top;
    }
`

export const HomeRight = styled.div`
    width:280px;
    float:right
`

export const TopicWrapper = styled.div`
    padding:20px 0 10px 0;
    margin-left:-18px;
    overflow:hidden;
    border-bottom:1px solid #dcdcdc
`
export const TopicItem = styled.div`
    float:left;
    height:32px;
    padding-right:10px;
    margin-left:18px;
    margin-bottom:18px;
    line-height:32px;
    font-size:14px;
    color:#000;
    background:#f7f7f7;
    border:1px solid #dcdcdc;
    border-radius:4px

    .top-pic{
        display:block;
        float:left;
        width:32px;
        height:32px;
        margin-right:10px;
    }
`

export const ListItem = styled.div`
    overflow:hidden;
    padding:20px 0;
    border-bottom:1px solid #dcdcdc 
    .pic{
        display:block;
        width:125px;
        height:100px;
        float:right
    }
`
export const ListInfo = styled.div`
     float:left;
     width:500px;
     .title{
         line-height:27px;
         font-size:18px
         font-weight: 700;
         color:#333
     }
     .desc{
        line-height:24px;
        font-size:14px;
        color:#999
     }
`

export const RecommendWrapper = styled.div`
    margin:30px 0;
    width:280px
`
export const RecommerndItem = styled.div`
    width:280px;
    height:50px;
    background:url(${(props) => props.imgUrl});
    background-size:contain
`

export const LoadMore = styled.div`
   width:100%;
   height:40px;
   margin:30px 0;
   line-height:40px;
   font-size:15px;
   cursor: pointer;
   background:#a5a5a5;
   text-align:center;
   border-radius:20px;
   color:#fff
`

export const BackTop = styled.div`
    position:fixed;
    right:30px;
    bottom:100px;
    width:60px;
    height:60px;
    font-size:14px;
    line-height:60px
    text-align:center;
    border:1px solid #ccc
`